Component({
  options: {
    multipleSlots: true // 启用多插槽支持
  },
  properties: {
    // 添加控制抽屉显示的状态属性
    showAlert: {
      type: Boolean,
      value: false,
      observer: function (newVal) { // 监听属性变化更新状态
        this.setData({ isShow: newVal })
      }
    },
    topConfirm: {
      type: Boolean,
      value: false,
    },
    hideButton: {
      type: Boolean,
      value: false,
    },
    noBorder: {
      type: Boolean,
      value: false,
    },
    maskColor: {
      type: String,
      value: 'rgba(255, 255, 255, .1)',
    },
    width: {
      type: String,
      value: '500rpx',
    },
    message: {
      type: String,
      value: '',
    }
  },

  data: {
    isShow: false // 组件内部状态
  },

  methods: {
    // 切换显示状态的方法
    toggleAlert() {
      this.setData({ isShow: !this.data.isShow })
      this.triggerEvent('change', { visible: this.data.isShow }) // 触发状态变更事件
    },
    showAlert() {
      this.setData({ isShow: true })
      this.triggerEvent('show') // 触发状态变更事件
    },
    hideAlert() {
      this.setData({ isShow: false })
      this.triggerEvent('hide') // 触发状态变更事件
    },
    preventScroll() { },
    // 点击遮罩层关闭
    handleMaskTap() {
      this.hideAlert()
    },
    handleConfirm() {
      this.toggleAlert()
      this.triggerEvent('confirm') // 触发关闭事件
    }
  }
})